Herzlich willkommen beim HTML-Grundkurs, um HTML dort zu lernen, wo es auch eingesetzt wird.

Zum Aufbau des Kurses:
In den ersten 7 Lektionen lernen Sie die technischen Dinge kennen, die zum Aufbau einer eigenen Webseite notwendig sind. Sie lernen die wichtigsten HTML-Befehle und sind damit in der Lage, eigene Seiten zu erstellen und diese auch nach Ihren Vorstellungen zu gestalten. Wir zeigen Ihnen zunächst die Möglichkeiten, die Sie mit HTML haben.  

In zweiten Teil des Kurses geben wir Ihnen Richtlinien für die Gestaltung der Seite (Layout, Ausrichtung auf Ihre Zielgruppe). Sie erfahren, wie Sie Anfängerfehler vermeiden und Ihre Seite ein ansprechendes Erscheinungsbild erhält. Sie lernen, wie Sie Ihre Seite bekannt machen und damit auch Besucher auf Ihre Internetpräsenz ziehen können. Wenden Sie die Kentnisse aus dem ersten Teil des Kurses an, so erhalten Sie auch das Erscheinungsbild, das Sie sich vorstellen.  

In dieser ersten Lektion erfahren Sie Folgendes:
 

1. Vorwort
2. Ein paar grundsätzliche Dinge
3. Was ist HTML, was kann HTML, was kann HTML nicht?
4. Welche Werkzeuge (Programme) benötigen Sie, um eigene Webseiten zu erstellen
5. Interessantes und Nützliches rund um das Internet
6. Was ist JavaScript, Java, CGI, PHP, ASP?
7. Fachbegriffe

 

1. Sie können Ihr Lerntempo selbst bestimmen.

 
2. Wenn Sie mit einer Lektion fertig sind, schalten Sie einfach auf die nächste weiter. Bitte überspringen Sie keine Lektion. Arbeiten Sie die Lektionen in der vorgegebenen Reihenfolge durch.

 
3. Online Support via E-Mail: 

Sie schicken mir eine E-Mail mit Angabe der Adresse im Web, wo ich Ihre Seite sehen kann, oder Sie senden mir eine Mail mit der Datei als Anhang (file-attachement). Ich schaue mir die Seite an und gebe Ihnen Antwort. Die Antwort erhalten Sie innerhalb von 24 Stunden.
 
4. Nutzen Sie unser Forum,

um mit anderen Kursteilnehmern ins Gespräch zu kommen und Erfahrungen auszutauschen.
Posten Sie Ihre Fragen und finden Sie gute Web-Adressen.
 
5. Online TalkHour

Solange Sie als Kursteilnehmer eingetragen sind, können Sie unseren Support in Anspruch nehmen. Wir unterstützen die wichtigsten Voice-Chat Programme (icq, MSNMessenger, PalTalk). Schicken Sie uns einfach eine Nachricht, wenn Sie Support per Voice Chat benötigen. Voice Chat anfordern
 
6. Was bedeutet Online Support?

Eine Reihe von Fragen taucht regelmäßig auf. Aus diesem Grund wurde die Rubrik Tipps und Tricks eingerichtet. Diese Rubrik wird ständig erweitert.
 
7. Drucken Sie die einzelnen Lektionen aus, nutzen Sie aber auch die Möglichkeiten des Internet: Sie können aus den einzelnen Lektionen direkt den HTML-Quelltext kopieren. Sie können die Hyperlinks in den Lektionen nutzen und so direkt auf die Quellen zugreifen, ohne lästiges Eintippen.

 
8. Sie haben die Möglichkeit, Ihre Seite in unserem Newsletter vorzustellen. Setzen Sie sich bei Interesse bitte mit uns in Verbindung.

 

HTML geht von einer hierarchischen Struktur aus. Mit HTML werden Struktur und Eigenschaften von Dokumenten beschrieben. Beispiele sind Textfarbe, Hintergrundfarbe, Schriftart und -größe. Der Inhalt eines Dokuments besteht aus mehreren Elementen mit gewissen Eigenschaften. Hierbei gibt es wiederum Elemente mit Unterelementen, wie zum Beispiel eine Tabelle mit einer bestimmten Randbreite und den einzelnen Zellen der Tabelle, die einen grünen Hintergrund haben könnten. HTML umfasst die Befehle, die diese Eigenschaften verändern können. 
Mit den HTML-Befehlen wird ein Dokument für das Internet erstellt. Dieses Dokument wird auf einem Rechner im Internet (Server) gespeichert und von einem Surfer aufgerufen. Der Hintergedanke bei HTML ist, dass jeder Computer mit Internetzugang dieses Dokument auch darstellen kann. Egal ob Apple- oder Windows-, Unix, Linux- Betriebssystem und Browser, jeder sollte dieses Dokument darstellen und nach Möglichkeit gleich darstellen können. HTML ist aus diesem Grund eine plattformunabhängige Sprache und nicht an ein Betriebssystem oder einen Browser gebunden. Und hier beginnen die Probleme: Sie wissen nicht, mit welchem Browser Ihre Webseiten betrachtet werden. Sie sagen, das sei kein Problem? Die aktuelle HTML-Version ist 4.0 und daran müssen sich alle halten? Die Befehle dieser Version werden nicht einmal von den beiden großen Browsern Netscape und Internet Explorer vollständig interpretiert. Doch damit nicht genug - die beiden Software-Firmen haben den Befehlssatz selbst erweitert, aber natürlich nicht in Absprache untereinander, sondern nach eigenem Gusto. Die Konsequenz: Sie müssen stets überprüfen, ob Ihre Webseite zumindest auf den zwei Standard-Browsern funktioniert. Für diesen Kurs bedeutet das: Es werden nur die Befehle behandelt, die von beiden Browsern interpretiert werden. Bei Bedarf werde ich auf die Browsereigenarten eingehen und die Unterschiede erläutern. Beide Browser, Netscape und der Internet Explorer, sollten Bestandteil Ihrer Werkzeug-Kiste für diesen Kurs sein.
Verfallen Sie nicht der Illusion, dass, nur weil Sie den Netscape Navigator für besser halten, alle Besucher Ihre Webseite mit dem Netscape Navigator betrachten. Optimieren Sie Ihre Seiten nicht für einen Browsertyp. Sie haben sicherlich schon auf so mancher Webseite gelesen "optimiert für ...." : Stellen Sie sich vor, Sie fahren auf der Autobahn und plötzlich kommt ein Schild "die Fahrer eines Golfs müssen die Standspur benutzen, da die Fahrbahn für alle anderen optimiert wurde!" 
Ein weiteres Problem ist die Auflösung des Bildschirms: Sie wollen heute keinem Surfer vorschreiben, Ihre Seiten mit einer Auflösung von 800 x 600 Pixel zu betrachten, um eine optimale Darstellung zu bekommen. Sie müssen ja im Kino auch nicht in der letzten Reihe sitzen, nur weil Sie Chips essen.

Für all diese Dinge gibt es Abhilfe. An gegebener Stelle werden diese Probleme im Kurs behandelt.

Ich gehe zunächst davon aus, dass Sie mit Windows (95/98/2000/NT/ME/XP), MAC oder Linux arbeiten - sollte dies nicht der Fall sein, bitte ich um eine Mail.

Sie brauchen einen einfachen Text - Editor:

z.B. den Windows Editor
Win: Start - Programme - Zubehör - Editor 

alternativ: Word Pad
Win: Start - Programme - Zubehör - Word Pad

Unter MAC OS verwenden Sie den SimpleText Editor und Stuffit (Aladin) zum Entpacken der Lektionen.
 

Wichtig!
Benutzen Sie bitte keines der Office-Programme wie Word und auf keinen Fall Frontpage oder Netscape Composer!

Warum? 
Alle Wysiwyg-Programme haben am Anfang einen wesentlichen Nachteil: Sie erzeugen für Sie den HTML-Code. Um aber zu verstehen, was passiert, müssen Sie selbst diesen Code erzeugen, weil nur Sie diesen Code falsch eingeben können und man ja bekanntlich aus den eigenen Fehlern lernt.
HTML ist wie gesagt plattformunabhängig und damit kein Zauberstab. Kontrollierte und gewünschte Resultate erhalten Sie aber nur, wenn Sie die Sprache verstehen. Sie können später immer noch auf irgendwelche Editoren zurückgreifen, wenn Sie verstehen, was diese an HTML-Code erzeugen und was dieser Code bewirkt. Um gewissen Unkenrufen vorzubeugen: Sehr viele Internetagenturen arbeiten mit textbasierten Editoren und nicht mit den Wysiwyg-Editoren. Wenn Sie mit einem Wysiwyg-Editor arbeiten und dann nachträglich den HTML-Code so anpassen müssen, dass die Seite so aussieht wie Sie/der Kunde es wollen, machen Sie Ihre Arbeit doppelt.
Wysiwyg steht für What you see is what you get, auf deutsch ungefähr "Was sie sehen bekommen Sie auch".
 

Browser

Wenn Sie Netscape Navigator und Internet Explorer bereits haben!

Sie sollten mindestens den Netscape Navigator und den Internet Explorer installiert haben, um Ihre Seite auch mit den beiden Standard-Browsern testen zu können.
Falls Ihnen einer der beiden fehlt, empfehle ich Ihnen EUR 5,- zu investieren und eine x-beliebige Computer- oder Internetzeitschrift an der nächsten Tankstelle zu kaufen, die CD-Beilage zu prüfen und damit das fehlende Programm zu installieren.

Es hat sich in letzter Zeit ein dritter Browser eingenistet: Opera ist mit einem kleinen Werbefenster kostenlos zu haben. Ohne Werbung kostet Opera Geld.(Opera downloaden).

Speicherplatz im Internet
 

Wenn Sie bereits Speicherplatz (Domain) im Internet haben

Was ist eine Domain?

Prüfen Sie zunächst, ob Sie durch Ihren Internetzugang über Ihren Service-Provider automatisch die Möglichkeit haben, eine eigene Homepage zu speichern. Bei den Großen (AOL, T-Online) ist dies der Fall und bei den anderen, weniger Großen erst recht. Sie müssen sich nur durch die Anleitung kämpfen. Es wird in der Regel step by step beschrieben, wie es funktioniert.

Für den Einstieg reicht ein Einsteigerpaket aus:
Im Umfang sollte enthalten: sein mindestens 1 MByte Speicherplatz, mindestens 3 E-Mail-Adressen, Formmailer (Formular-Mailer zum Versenden von Daten aus einem echten E-Mail-Formular heraus), Gästebuch, Counter, Statistik. Sie benötigen zunächst nur eine Art "Spielwiese", wo Sie testen und Ihre ersten Seiten ins Netz stellen können.

Wenn Sie eine eigene Domain beantragen wollen, gibt es grundsätzlich zwei Möglichkeiten:

Kostenpflichtig:

Eigene Domains wie www.LernenImInternet.de. Halten Sie sich ran - es gibt schon weit über vier Millionen *.de-Domains, aber nicht unbegrenzt viele einfache Namen. Testen Sie bei den folgenden Anbietern ein paar Namen, um zu sehen, was alles schon belegt ist..

www.strato.de
Hinter Strato steht die Teles AG, Berlin. (Strato hat seit Ende 99 Probleme - siehe Tagespresse).

www.puretec.de
Hinter puretec steht die Firma 1&1 aus Montabaur/Eifel. 

Strato und Puretec sind zur Zeit die beiden Größten und vergeben die meisten Domains. Ihre Leistungen und Preise sind ähnlich.

www.3mark49.de
Der Name ist Programm. Die Auswahl an Zusatzleistungen ist sehr eingeschränkt, aber die billigste Lösung.

Seit Anfang Mai 2000 ist www.loomes.de aktiv.

Abhängig davon, welches Projekt Sie realisieren wollen, sollten Sie auch regionale Anbieter berücksichtigen. Es kann vorteilhafter sein, ohne ein vorgeschaltetes CallCenter direkt mit den zuständigen Personen sprechen zu können. 

Kostenlos:

Es gibt eine Vielzahl von deutschen und internationalen Anbietern, die Ihnen kostenlos Speicherplatz zur Verfügung stellen. Bei vielen müssen Sie für einen gewissen Zeitraum oder für immer ein Werbebanner auf Ihrer Seite dulden. Sie haben keine echte eigene Domain, sondern nur eine Subdomain. 
www.fortunecity.de
www.geocities.de

Wem diese drei nicht reichen, der findet weitere unter www.nulltarif.de . Mehr dazu in der Rubrik Homepage.

Sollten Sie beabsichtigen, eine kommerzielle Seite zu betreiben, greifen Sie auf andere Anbieter zurück! Eine kostenlose Internetpräsenz ist sinnvoll für Tests und private Spielereien. Eine kommerzielle Seite oder die Präsenz der eigenen Firma im Internet hat auf kostenlosem Webspace nichts verloren. Wichtig ist die Zuverlässigkeit und Erreichbarkeit. Bei Preisen, die sich im Bereich von 10,- bis 50,- EUR/Monat bewegen, darf es auf einen Euro nicht ankommen. Ihre Telefonrechnung dürfte höher sein. Bedenken Sie folgendes: Wenn Ihre Seite nicht erreichbar ist, wird dies Ihnen angelastet und nicht Ihrem Provider oder Hoster. Mehr Informationen und eigene Erfahrungen gebe ich gerne weiter.
 
 
 

FTP-Programm

Wenn Sie bereits über ein FTP-Programm verfügen

Was ist das?
Um Ihre Dateien von Ihrem Rechner auf Ihren Speicherplatz im Internet zu übertragen, benötigen Sie ein Programm. Diese Programme arbeiten mit dem file transfer protocol und sorgen für die Übertragung (transfer) der Dateien (files) von Ihrem Computer auf den Server im Internet.

Grundsätzlich spielt es keine Rolle, mit welchem Programm Sie arbeiten, ich empfehle WS_FTP, äquivalent sind NetLoad, CuteFTP, LeechFTP etc.

Die Programme gibt's z.B. bei
http://download.cnet.com/downloads, (das ist eine gute internationale Adresse) oder
www.winsoftware.de (sehr gut sortierte deutsche Adresse).
 

Grafikprogramm mit HTML-Code für Farben
Wenn Sie bereits über ein Grafikprogramm mit HTML-Code für Farben verfügen

Wie erkenne ich das?
Öffnen Sie Ihr Grafikprogramm, wählen Sie eine Farbe über den entsprechenden Dialog. Wenn in diesem Fenster eine sechstellige Kombination aus Ziffern und Zahlen steht vom Typ A088C2, dann klappts.

Zum Erstellen eigener Grafiken für Internet-Seiten muss das Grafikprogramm die Dateiformate gif und *.jpg (*.jpeg) unterstützen. Die billigen/kostenlosen Programme tun dies in der Regel nicht! Sie können dieses Problem im Augenblick ungelöst lassen, wir kommen in Lektion 3 auf die Problematik zurück.

Falls Sie es nicht erwarten können: http://download.cnet.com/downloads oder www.winsoftware.de bietet Share-, Freeware und Trialversionen an. In der Rubrik Tipps und Tricks auf www.LernenImInternet.de finden Sie eine Auswahl von Grafikprogrammen und Grafikarchiven. 
 

Winzip

Sie sollten über Winzip (oder ein ähnliches Programm) verfügen. 

Was ist das ? 
Ein Programm zum Komprimieren und Dekomprimieren von Dateien.

Warum? 
Nicht alle Lektionen bestehen nur aus einer Datei und manche Lektionen sind etwas länger. Es geht schneller, wenn Sie die Dateien komprimiert downloaden.

Wo gibts das?
Entweder direkt bei Hersteller: WinZip oder
http://download.cnet.com/downloads oder www.winsoftware.de oder wie üblich in einer Computerzeitschrift aus der nächsten Tankstelle.

Die www.Denic.de regelt die Vergabe deutscher Domains. Dort können Sie auch erfahren, welche Domains noch frei sind, bzw. wem eine Domain gehört.
 

Javascript 
Javascript ist eine Programmiersprache in Anlehnung an C/C++ als Ergänzung zu HTML. Mit Javascript können Sie Funktionen in Ihre Webseiten einbauen - z.B. einen Ticker einfügen, Grafiken austauschen oder Anpassungen der Seiteninhalte an die Bildschirmauflösung vornehmen. 
Als Beispiel: Auf vielen Seiten ändert sich die Text- oder Hintergrundfarbe beim Überfahren mit der Maus. Dahinter steckt oftmals Javascript.
Wie HTML ist JavaScript eine plattformunabhängige Sprache und sollte eigentlich mit jedem Browser funktionieren. 

Java
Auch Java ist eine plattformunabhängige Programmiersprache, bei der Programme nicht für jedes Betriebssystem neu geschrieben werden müssen. Ein über das Internet übertragenes Programm kann damit ohne neue Programmierung z. B. unter Windows und auf einem Mac gleichzeitig genutzt werden. Im Unterschied zu Javascript wird nicht der Quellcode übertragen, sondern ein vorkompilierter Programmcode. Die Konsequenz ist, dass Sie die Befehle in Javascript einsehen können, da diese direkt in die HTML-Datei geschrieben werden. Bei Java selbst haben Sie keine direkte Möglichkeit, den Befehlscode zu betrachten und es ist damit auch nicht möglich, den Code oder Quelltext des Programms einzusehen. 

CGI
CGI steht für Common Gateway Interface, ist also eine Art allgemeine Vermittlungsschnittstelle. Die Anweisungen/Befehle werden in einem CGI-Script notiert.

PHP, ASP
Beide Programmiersprachen sind vergleichbar mit CGI. Sie dienen der Verarbeitung von Daten durch den Server. 

Was macht ein CGI(ASP,PHP) -Script?
Sie haben sicher schon mit Suchmaschinen gearbeitet. Das Prinzip ist folgendes: Sie schicken eine Suchanfrage an die Datenbank der Suchmaschine. Die Ergebnisse der Suche müssen, damit sie auf dem Bildschirm dargestellt werden, in Form eines HTML-Dokuments vorliegen. Ein CGI(ASP,PHP)-Script sortiert und verpackt die Suchergebnisse in dieses HTML-Dokument.
Zweites Beispiel: Wenn Sie ein echtes E-Mail Formular ausfüllen, müssen die Formulareinträge an die E-Mail-Adresse des Empfängers versandt werden. Dies geschieht mittels eines CGI-Scripts. Oder Sie tragen sich in ein Gästebuch ein. Ihr Gästebucheintrag muss später für jedermann zugänglich sein und wird somit auf dem Server der betreffenden Webseite gespeichert. Dies regelt ebenfalls ein CGI-Script. 
 
 

Aufgabe:

1. Organisieren Sie Ihren Speicherplatz im Internet! 

Machen Sie sich mit dem Zugang auf Ihren eigenen Speicherplatz vertraut, lesen Sie die Anleitung und versuchen Sie durchaus einmal auf Ihren Speicherplatz im Web zuzugreifen. (Führen Sie die typischen Dateioperationen aus: speichern, umbenennen, Unterverzeichnisse erstellen, etc.)
 
2. Machen Sie sich ein paar Gedanken zu den Inhalten Ihrer Webpräsenz.

Denken Sie zunächst an die Zielgruppe, die angesprochen werden soll. Für eine Firmenpräsenz stellt sich die Frage, ob die Webseite zur Neukundengewinnung dienen soll, ob bestehende Kundenbeziehungen weiter gepflegt werden (Produktneuerungen, Updates, neue Produkte) oder ob die Seite in erster Linie eine Support-Hotline darstellen soll. Welches Alter, welche Berufsgruppe wollen Sie ansprechen? Versuchen Sie, Ihre Zielgruppe möglichst scharf zu definieren.

Subdomain
Eine Domain kann in weitere sogenannte Sub-Domains aufgeteilt werden, die durch Punkte getrennt sind. Ein Beispiel: Die Domain jaitner.de könnte in folgende Subdomains aufgeteilt sein: kurs.jaitner.de oder teilnehmer.jaitner.de. Diese Struktur mit Subdomains findet sich oft bei kostenlosen Anbietern von Web-Speicherplatz.

Sollten Sie länger als 30 Minuten an einem Problem brüten, schicken Sie mir bitte eine Mail.
 

 © Copyright Dr. Horst Jaitner.  Dieser Text ist urheberrechtlich geschützt. Alle Rechte vorbehalten. Die Verwendung der Texte und Bilder ohne Genehmigung, auch auszugsweise, ist strafbar. Das gilt auch für die Verwendung in Kursunterlagen, Vervielfältigung oder Verwendung in elektronischen Systemen.